<script>
/*
 * Copyright (c) 2012-2013 RockStor, Inc. <http://rockstor.com>
 * This file is part of RockStor.
 *
 * RockStor is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published
 * by the Free Software Foundation; either version 2 of the License,
 * or (at your option) any later version.
 *
 * RockStor is distributed in the hope that it will be useful, but
 * WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
 * General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program. If not, see <http://www.gnu.org/licenses/>.
 *
 */
</script>


<!-- Module Body -->
<div class="row">
  <div class="col-md-12">
    <div class="messages"></div>
    <!-- Content -->
    <h3> Rockstor Admin users </h3>
    <table id="users-table" class="table table-bordered table-striped share-table data-table" summary="List of user">
      <thead>
        <tr>
          <th scope="col" abbr="Name">Username</th>
          <th scope="col" abbr="UID">UID</th>
          <th scope="col" abbr="Group">Group</th>
	  <th scope="col" abbr="GID">GID</th>
	  <th scope="col" abbr="Shell">Shell</th>
          <th scope="col" abbr="Actions">Actions</th>
        </tr>
      </thead>
      <tbody>
        {{display_users_table true}}
      </tbody>
    </table>
    <a href="#add-user" id="add-user" class="btn btn-primary">Add User</a>

    <h3> Other system users </h3>
    <table id="users-table" class="table table-bordered table-striped share-table data-table" summary="List of user">
      <thead>
        <tr>
          <th scope="col" abbr="Name">Username</th>
          <th scope="col" abbr="UID">UID</th>
	  <th scope="col" abbr="Group">Group</th>
          <th scope="col" abbr="GID">GID</th>
	  <th scope="col" abbr="Shell">Shell</th>
          <th scope="col" abbr="Actions">Actions</th>
        </tr>
      </thead>
      <tbody>
      {{display_users_table false}}
      </tbody>
      </table>
</div> <!-- col-md-12 -->
</div> <!-- row -->

<!-- Preload Rockcost Pincard background image-->
<img style="visibility: hidden; display: none;" id="canvas_background" src="static/storageadmin/img/rockstor-sticker.png">

<div id="pincard-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog" style="width: 350px;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h4 id="myModalLabel">Pincard Generator</h4>
      </div>
      <div class="modal-body">
        <div class="messages"></div>
        <p style="text-align: center;">
		<canvas id="Pincard_canvas" width="324" height="204"></canvas>
		</p>
		<p style="text-align: justify; font-size: small;">
		This is your pincard for user <span id="pincard_user" style="font-style: italic; font-weight: bold;"></span>, right click on it and save as png image.<br/>
		Generated pincard is in <a href="https://en.wikipedia.org/wiki/ISO/IEC_7810"
		target="_blank">ISO/IEC 7810 ID-1</a> format (mm 85.60x53.98 over a 96 dpi monitor) and 
		can be printed or applied over an ID-1 size card.
		</p>
		<p style="text-align: justify; font-size: small; font-weight: bold;" id="pins_list"></p>
      </div>
    </div>
  </div>
</div>
